{php include wl_template('common/header');}
<link href="{URL_MODULE}plugin/diyposter/sys/resource/css/designer.css" rel="stylesheet" />
<script language='javascript' src="{URL_MODULE}plugin/diyposter/sys/resource/js/designer.js"></script>
<ul class="nav nav-tabs">
	<li class="active"><a href="javascript:;">编辑海报</a></li>
</ul>
<div class="app-content">
	<div class="app-form">
		<form action="" method="post" class="form-horizontal form form-validate" id="setting-form">
			<div class="panel panel-default">
				<div class="panel-heading">编辑海报</div>
				<div class="panel-body">
					<div class="form-group">
						<div class="col-sm-12">
							<table style='width:100%;'>
								<tr>
									<td style='width:320px;padding:10px;' valign='top'>
										<div id='poster' style="{if $item['type'] == 10}width: 345px;height: 361px;{/if}">
											{if !empty($item['bg'])}
											<img src='{php echo tomedia($item['bg'])}' class='bg'/>
											{/if}
											{if !empty($data)}
											{loop $data $key $d}
											<div class="drag {$d['border']} {$d['align']}" type="{$d['type']}" index="{php echo $key+1}" style="zindex:{php echo $key+1};left:{$d['left']};top:{$d['top']};width:{$d['width']};height:{$d['height']}"
												 src="{$d['src']}" size="{$d['size']}" color="{$d['color']}" words="{$d['words']}" border="{$d['border']}" align="{$d['align']}" line="{$d['line']}">
												{if $d['type']=='qr'}
												<img src="../addons/{MODULE_NAME}/plugin/diyposter/sys/resource/images/qr.png" />
												{elseif $d['type']=='head' || $d['type']=='logo'}
												<img src="../addons/{MODULE_NAME}/plugin/diyposter/sys/resource/images/head.jpg" />
												{elseif $d['type']=='img' || $d['type']=='thumb' || $d['type'] == 'shopThumb'}
												<img src="{php echo empty($d['src'])?'../addons/'.MODULE_NAME.'/plugin/diyposter/sys/resource/images/img.jpg':tomedia($d['src'])}" />
												{elseif ($d['type']=='vip_price' || $d['type']=='nickname' || $d['type']=='title' || $d['type']=='marketprice' || $d['type']=='productprice' || $d['type']=='sub_title' || $d['type']=='text' || $d['type']=='shopTitle' || $d['type']=='shopAddress' || $d['type']=='activityaddress' || $d['type']=='shopPhone' || $d['type']=='name' || $d['type']=='position' || $d['type']=='address' || $d['type']=='mobile' || $d['type']=='desc' || $d['type']=='wechat' || $d['type']=='company_branch' || $d['type']=='numbers')}
													<div class=text style="font-size:{$d['size']};color:{$d['color']}">{php echo !empty($d['words']) ? $d['words'] : '未命名';}</div>
												{/if}
												<div class="rRightDown"> </div><div class="rLeftDown"> </div><div class="rRightUp"> </div><div class="rLeftUp"> </div><div class="rRight"> </div><div class="rLeft"> </div><div class="rUp"> </div><div class="rDown"></div>
											</div>
											{/loop}
											{/if}
										</div>

									</td>
									<td valign='top' style='padding:10px;'>
										<div class='panel panel-default'>
											<div class='panel-body'>
												<div class="form-group">
													<label class="col-sm-2 control-label">海报名称</label>
													<div class="col-sm-9">
														<input type="text" name="title" class="form-control valid" value="{$item['title']}" data-rule-required="true" />
													</div>
												</div>
												<div class="form-group">
													<label class="col-sm-2 control-label">海报类型</label>
													<div class="col-sm-9">
														<label class="radio-inline">
															<input type="radio" name="type" value="1" {if $item['type']==1 || empty($item['type'])}checked{/if} /> 商家海报
														</label>
														{if p('rush')}
														<label class="radio-inline">
															<input type="radio" name="type" value="2" {if $item['type']==2}checked{/if} /> 抢购海报
														</label>
														{/if}
														{if p('wlcoupon')}
														<label class="radio-inline">
															<input type="radio" name="type" value="3" {if $item['type']==3}checked{/if} /> 卡券海报
														</label>
														{/if}
														{if p('distribution')}
														<label class="radio-inline">
															<input type="radio" name="type" value="4" {if $item['type']==4}checked{/if} /> 分销海报
														</label>
														{/if}
														{if p('groupon')}
														<label class="radio-inline">
															<input type="radio" name="type" value="5" {if $item['type']==5}checked{/if} /> 团购海报
														</label>
														{/if}
														{if p('wlfightgroup')}
														<label class="radio-inline">
															<input type="radio" name="type" value="6" {if $item['type']==6}checked{/if} /> 拼团海报
														</label>
														{/if}
														{if p('bargain')}
														<label class="radio-inline">
															<input type="radio" name="type" value="7" {if $item['type']==7}checked{/if} /> 砍价海报
														</label>
														{/if}
														{if p('activity')}
														<label class="radio-inline">
															<input type="radio" name="type" value="14" {if $item['type']==14}checked{/if} /> 活动海报
														</label>
														{/if}
														{if p('salesman')}
														<!--<label class="radio-inline">
															<input type="radio" name="type" value="8" {if $item['type']==8}checked{/if} /> 业务员海报
														</label>-->
														{/if}
														{if p('consumption')}
														<label class="radio-inline">
															<input type="radio" name="type" value="9" {if $item['type']==9}checked{/if} /> 积分商城海报
														</label>
														{/if}
														{if p('citycard')}
															<!--<label class="radio-inline">
																<input type="radio" name="type" value="10" {if $item['type']==10}checked{/if} /> 名片海报
															</label>-->
														{/if}
														{if p('subposter')}
														<label class="radio-inline">
															<input type="radio" name="type" value="11" {if $item['type']==11}checked{/if} /> 倡议关注海报
														</label>
														{/if}
														{if p('dating')}
															<label class="radio-inline">
																<input type="radio" name="type" value="15" {if $item['type']==15}checked{/if} /> 红娘海报
															</label>
														{/if}
														{if p('housekeep')}
														<label class="radio-inline">
															<input type="radio" name="type" value="16" {if $item['type']==16}checked{/if} /> 家政海报
														</label>
														{/if}
														{if Customized::init('redpack527') > 0}
														<label class="radio-inline">
															<input type="radio" name="type" value="17" {if $item['type']==17}checked{/if} /> 红包海报
														</label>
														{/if}
													</div>
												</div>
												<div class="form-group" id="bgset">
													<label class="col-sm-2 control-label">默认背景</label>
													<div class="col-sm-9">
														{php echo attachment_select('bg',$item['bg'])}
														<span class='help-block'>背景图片尺寸: 640 * 1136</span>
													</div>
												</div>
												<div class="form-group" id="otherbg">
													<label class="col-sm-2 control-label">背景图片</label>
													<div class="col-sm-9">
														{php echo attachment_select_multi('otherbg',$item['otherbg'])}
														<span class='help-block'>选填，不需要切换背景图就不上传，背景图片尺寸: 640 * 1136</span>
													</div>
												</div>
												<div class="form-group">
													<label class="col-sm-2 control-label">海报元素</label>
													<div class="col-sm-9">
                                                        <button class='btn btn-default btn-com' type='button' data-type='vip_price' {if !in_array(intval($item['type']), array(2,5,3,7,9))}style="display:none"{/if}>会员价格</button>
														<button class='btn btn-default btn-com' type='button' data-type='vip_discount' {if $item['type'] != 14}style="display:none"{/if}>会员减免</button>
														<button class='btn btn-default btn-com' type='button' data-type='head' >头像</button>
														<button class='btn btn-default btn-com' type='button' data-type='nickname' >昵称</button>
														<button class='btn btn-default btn-com' type='button' data-type='qr' >二维码</button>
														<button class='btn btn-default btn-com' type='button' data-type='img' >图片</button>
														<button class='btn btn-default btn-com' type='button' data-type='text' >文字</button>
														<span id="storeparams" {if $item['type'] == 4 || $item['type'] == 9 || $item['type'] == 10 || $item['type'] == 11 || $item['type'] == 15}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='shopTitle'>店铺名称</button>
															<button class='btn btn-default btn-com' type='button' data-type='shopThumb'>店铺图片</button>
                                                            <button class='btn btn-default btn-com' type='button' data-type='shopAddress'>店铺地址</button>
                                                            <button class='btn btn-default btn-com' type='button' data-type='shopPhone'>店铺电话</button>
														</span>
														<span id="rushparams" {if $item['type']!=2}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='title' >抢购名称</button>
															<button class='btn btn-default btn-com' type='button' data-type='thumb' >抢购图片</button>
															<button class='btn btn-default btn-com' type='button' data-type='marketprice' >抢购现价</button>
															<button class='btn btn-default btn-com' type='button' data-type='productprice' >抢购原价</button>
														</span>
														<span id="grouponparams" {if $item['type']!=5}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='title' >团购名称</button>
															<button class='btn btn-default btn-com' type='button' data-type='thumb' >团购图片</button>
															<button class='btn btn-default btn-com' type='button' data-type='marketprice' >团购现价</button>
															<button class='btn btn-default btn-com' type='button' data-type='productprice' >团购原价</button>
														</span>
														<span id="cardparams" {if $item['type']!=3}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='title' >卡券标题</button>
															<button class='btn btn-default btn-com' type='button' data-type='sub_title' >卡券描述</button>
															<button class='btn btn-default btn-com' type='button' data-type='thumb' >卡券图片</button>
															<button class='btn btn-default btn-com' type='button' data-type='marketprice' >卡券价格</button>
														</span>
														<span id="fightgroupparams" {if $item['type']!=6}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='title' >拼团名称</button>
															<button class='btn btn-default btn-com' type='button' data-type='thumb' >拼团图片</button>
															<button class='btn btn-default btn-com' type='button' data-type='marketprice' >拼团价</button>
															<button class='btn btn-default btn-com' type='button' data-type='productprice' >单买价</button>
														</span>
														<span id="bargainparams" {if $item['type']!=7}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='title' >砍价名称</button>
															<button class='btn btn-default btn-com' type='button' data-type='thumb' >砍价图片</button>
															<button class='btn btn-default btn-com' type='button' data-type='marketprice' >底价</button>
															<button class='btn btn-default btn-com' type='button' data-type='productprice' >原价</button>
														</span>
														<span id="activityparams" {if $item['type']!=14}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='title' >活动名称</button>
															<button class='btn btn-default btn-com' type='button' data-type='thumb' >活动图片</button>
															<button class='btn btn-default btn-com' type='button' data-type='marketprice' >报名价</button>
															<button class='btn btn-default btn-com' type='button' data-type='activityaddress' >活动地址</button>
														</span>
														<span {if $item['type']!=9}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='title' >商品名称</button>
															<button class='btn btn-default btn-com' type='button' data-type='thumb' >商品图片</button>
															<button class='btn btn-default btn-com' type='button' data-type='marketprice' >现价</button>
															<button class='btn btn-default btn-com' type='button' data-type='productprice' >原价</button>
														</span>
														<span id="usercardparams" {if $item['type']!=10}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='name' >名片名称</button>
															<button class='btn btn-default btn-com' type='button' data-type='position' >职位</button>
															<button class='btn btn-default btn-com' type='button' data-type='company_branch' >公司|部门</button>
															<button class='btn btn-default btn-com' type='button' data-type='logo' >名片头像</button>
															<button class='btn btn-default btn-com' type='button' data-type='address' >地址</button>
															<button class='btn btn-default btn-com' type='button' data-type='mobile' >电话</button>
															<button class='btn btn-default btn-com' type='button' data-type='desc' >介绍</button>
															<button class='btn btn-default btn-com' type='button' data-type='wechat' >微信号</button>
														</span>
														<span id="subposterparams" {if $item['type']!=11}style="display:none"{/if}>
															<button class='btn btn-default btn-com' type='button' data-type='numbers'>人数</button>
														</span>
														<span id="housekeepparams" {if $item['type'] != 16} style="display:none" {/if}>
															<button class='btn btn-default btn-com' type='button' data-type='title'>服务名称</button>
															<button class='btn btn-default btn-com' type='button' data-type='logo'>服务缩略图</button>
															<button class='btn btn-default btn-com' type='button' data-type='thumb'>服务首图</button>
															<button class='btn btn-default btn-com' type='button' data-type='marketprice'>服务价格</button>
														</span>
													</div>
												</div>
												<div id='qrset' style='display:none'>
													<div class="form-group">
														<label class="col-sm-2 control-label">二维码尺寸</label>
														<div class="col-sm-9">
															<select id='qrsize' class='form-control'>
																<option value='1'>1</option>
																<option value='2'>2</option>
																<option value='3'>3</option>
																<option value='4'>4</option>
																<option value='5'>5</option>
																<option value='6'>6</option>
															</select>
														</div>

													</div>
												</div>
												<div id="headset" style='display:none'>
													<div class="form-group">
														<label class="col-sm-2 control-label">头像样式</label>
														<div class="col-sm-9">
															<label class="radio-inline"><input type="radio" value="" name="style">正方形</label>
															<label class="radio-inline"><input type="radio" value="radius" name="style"> 圆角</label>
															<label class="radio-inline"><input type="radio" value="circle" name="style" checked=""> 圆形</label>
														</div>
													</div>
												</div>
												<div id='nameset' style='display:none'>
													<div class="form-group">
														<label class="col-sm-2 control-label">文字颜色</label>
														<div class="col-sm-9">
															{php echo tpl_form_field_color('color')}
														</div>
													</div>
													<div class="form-group">
														<label class="col-sm-2 control-label">文字大小</label>
														<div class="col-sm-9">
															<div class='input-group'>
																<input type="text" id="namesize" class="form-control namesize" placeholder="例如: 14,16"  />
																<div class='input-group-addon'>px</div>
															</div>
														</div>
													</div>
													<div class="form-group textwords" style='display:none'>
														<label class="col-sm-2 control-label">文字内容</label>
														<div class="col-sm-9">
															<input type="text" id="textwords" class="form-control" placeholder="请输入文字内容"  />
														</div>
													</div>
													<div class="form-group">
														<label class="col-sm-2 control-label">文字对齐</label>
														<div class="col-sm-9">
															<label class="radio-inline"><input type="radio" value="left" name="align"> 左对齐</label>
															<label class="radio-inline"><input type="radio" value="center" name="align"> 居中</label>
														</div>
													</div>
													<div class="form-group">
														<label class="col-sm-2 control-label">文字行数</label>
														<div class="col-sm-9">
															<select id='textline' class='form-control'>
																<option value='1'>1</option>
																<option value='2'>2</option>
																<option value='3'>3</option>
																<option value='4'>4</option>
																<option value='5'>5</option>
															</select>
														</div>
													</div>
												</div>
												<div class="form-group" id="imgset" style="display:none">
													<label class="col-sm-2 control-label">图片设置</label>
													<div class="col-sm-9">
														{php echo attachment_select('img')}
													</div>
												</div>
												<div class="form-group">
													<label class="col-sm-2 control-label">辅助对齐</label>
													<div class="col-sm-9">
														<div class="btn btn-default btn-sm btn-align" data-align="left"><i class="fa fa-align-left"></i> 居左</div>
														<div class="btn btn-default btn-sm btn-align" data-align="center"><i class="fa fa-align-center"></i> 居中</div>
														<div class="btn btn-default btn-sm btn-align" data-align="right"><i class="fa fa-align-right"></i> 居右</div>
														<div class="help-block">尝试使用键盘的上下左右键进行位置调整</div>
													</div>
												</div>
											</div>
										</div>
										<div class="form-group">
											<label class="col-sm-2 control-label"></label>
											<div class="col-sm-9">
												<input type="submit" name="submit" value="提交" class="btn btn-primary min-width" />
												<input type="hidden" name="token" value="{$_W['token']}" />
											<input type="hidden" name="data" value="" />
											</div>
										</div>
									</td>
								</tr>
							</table>
						</div>
					</div>
				</div>
			</div>
		</form>
	</div>
</div>

<script language='javascript'>
	var _currentDom = null;
	$('form').submit(function(){
	    var data = [];
	    $('.drag').each(function(){
	        var obj = $(this);
	        var type = obj.attr('type');
	        var left = obj.css('left'),top = obj.css('top');
	        var d= {left:left,top:top,type:obj.attr('type'),width:obj.css('width'),height:obj.css('height')};
	        if(	type=='nickname' || type=='title' || type=='marketprice' || type=='productprice' || type=='sub_title' ||
					type=='text' || type=='vip_price' || type=='vip_discount' || type=='shopTitle' || type=='shopAddress' || type=='activityaddress' || type=='shopPhone' ||
					type=='name' || type=='position' || type=='address' || type=='mobile' || type=='desc' || type=='wechat' || type=='company_branch' || type=='numbers'){
	        	d.line = obj.attr('line');
	            d.size = obj.attr('size');
	            d.color = obj.attr('color');
	            d.words = obj.attr('words');
	            d.align = obj.attr('align');
	        } else if(type=='qr'){
	            d.size = obj.attr('size');
	        } else if(type=='img'){
	            d.src = obj.attr('src');
	        } else if(type=='head' || type=='logo'){
	            d.border = obj.attr('border');
	        }
	        data.push(d);
	    });
	    $(':input[name=data]').val( JSON.stringify(data));
	    $('form').removeAttr('stop');
	    return true;
	});

   	$('.btn-align').click(function () {
        if(_currentDom==null){
            return;
        }

        var width = _currentDom.width();
        var align = $(this).data('align');
        if(align=='left'){
            _currentDom.css("left", "0px");
        }else if(align=='right'){
            _currentDom.css("left", (320 - width) + "px");
        }else{
        	_currentDom.css("left", (160 - width/2) + "px");
        }
    });

    function bindEvents(obj){
        var index = obj.attr('index');
        var rs = new Resize(obj, { Max: true, mxContainer: "#poster" });
        rs.Set($(".rRightDown",obj), "right-down");
        rs.Set($(".rLeftDown",obj), "left-down");
        rs.Set($(".rRightUp",obj), "right-up");
        rs.Set($(".rLeftUp",obj), "left-up");
        rs.Set($(".rRight",obj), "right");
        rs.Set($(".rLeft",obj), "left");
        rs.Set($(".rUp",obj), "up");
        rs.Set($(".rDown",obj), "down");
        rs.Scale = true;
        var type = obj.attr('type');
        if(type=='vip_price' || type=='shopThumb' || type=='thumb' || type=='nickname' || type=='img' || type=='title' || type=='marketprice' ||
				type=='productprice' || type=='sub_title' || type=='text' || type=='shopTitle' || type=='shopAddress' || type=='activityaddress' || type=='shopPhone' ||
				type=='name' || type=='position' || type=='address' || type=='mobile' || type=='desc' || type=='wechat' || type=='company_branch' || type=='numbers'){
            rs.Scale = false;
        }
        new Drag(obj, { Limit: true, mxContainer: "#poster" });
        $('.drag .remove').unbind('click').click(function(){
            $(this).parent().remove();
        })
	    myrequire(['jquery.contextMenu'],function(){
	        $.contextMenu({
	            selector: '.drag[index=' + index + ']',
	            callback: function(key, options) {
	                var index = parseInt($(this).attr('zindex'));

	                if(key=='next'){
	                    var nextdiv = $(this).next('.drag');
	                    if(nextdiv.length>0 ){
	                        nextdiv.insertBefore($(this));
	                    }
	                } else if(key=='prev'){
	                    var prevdiv = $(this).prev('.drag');
	                    if(prevdiv.length>0 ){
	                        $(this).insertBefore(prevdiv);
	                    }
	                } else if(key=='last'){
	                    var len = $('.drag').length;
	                    if(index >=len-1){
	                        return;
	                    }
	                    var last = $('#poster .drag:last');
	                    if(last.length>0){
	                        $(this).insertAfter(last);
	                    }
	                }else if(key=='first'){
	                    var index = $(this).index();
	                    if(index<=1){
	                        return;
	                    }
	                    var first = $('#poster .drag:first');
	                    if(first.length>0){
	                        $(this).insertBefore(first);
	                    }
	                }else if(key=='delete'){
	                    $(this).remove();
	                }
	                var n =1 ;
	                $('.drag').each(function(){
	                    $(this).css("z-index",n);
	                    n++;
	                })
	            },
	            items: {
	                "next": {name: "调整到上层"},
	                "prev": {name: "调整到下层"},
	                "last": {name: "调整到最顶层"},
	                "first": {name: "调整到最低层"},
	                "delete": {name: "删除元素"}
	            }
	        });
	        obj.unbind('click').click(function(){
	            bind($(this));
	        })
        });
    }

   	var imgsettimer = 0 ;
   	var nametimer = 0;
   	var bgtimer = 0 ;

    function bindType(type){
        $("#storeparams").hide();
        $("#rushparams").hide();
        $("#grouponparams").hide();
        $("#cardparams").hide();
        $("#fightgroupparams").hide();
        $("#bargainparams").hide();
		$("#subposterparams").hide();
		$("#activityparams").hide();
		$("#housekeepparams").hide();
		$("[data-type='vip_price']").show();
        $("#storeparams").show();
        if(type=='1' || type=='17'){
            $("[data-type='vip_price']").hide();
        } else if(type=='2'){
            $("#rushparams").show();
        } else if(type=='3'){
        	$("#cardparams").show();
        } else if(type=='5'){
        	$("#grouponparams").show();
        } else if(type=='6'){
            $("[data-type='vip_price']").hide();
        	$("#fightgroupparams").show();
        } else if(type=='7'){
        	$("#bargainparams").show();
        } else if(type=='4' || type=='8'){
            $("#storeparams").hide();
            $("[data-type='vip_price']").hide();
        } else if(type == 10){
			$("#storeparams").hide();
			$("[data-type='vip_price']").hide();
			$("[data-type='head']").hide();
			$("[data-type='nickname']").hide();
			$("#usercardparams").show();
			$("#poster").css({
				"width":"345px",
				"height":"361px",
			});
		} else if(type == 11){
			$("#storeparams").hide();
			$("[data-type='vip_price']").hide();
			$("#subposterparams").show();
		} else if(type == 14){
			$("#activityparams").show();
			$("[data-type='vip_price']").hide();
			$("[data-type='vip_discount']").show();
		} else if(type == 15){
			$("#storeparams").hide();
			$("[data-type='vip_price']").hide();
		} else if(type == 16){
			$("#housekeepparams").show();
			$("[data-type='vip_price']").hide();
		}
    }

    function clearTimers(){
       	clearInterval(imgsettimer);
       	clearInterval(nametimer);
       	clearInterval(bgtimer);
    }

    function getImgUrl(val){
   		if(val.indexOf('http://')==-1 && val.indexOf('https://')==-1){
            val = "{$imgroot}" + val;
        }
        return val;
    }

    function bind(obj){
    	var index = obj.attr('index');
    	obj.siblings('.drag').removeClass('selected');
    	obj.addClass('selected');
    	_currentDom = obj;
        var imgset = $('#imgset'), nameset = $("#nameset"),qrset = $('#qrset'),textwords = $('.textwords'),headset = $('#headset');
        imgset.hide(),nameset.hide(),qrset.hide(),textwords.hide(),headset.hide();
        clearTimers();
       	var type = obj.attr('type');
       	if(type=='img'){
           	imgset.show();
           	var src = obj.attr('src');
           	var input = imgset.find('input');
           	var img = imgset.find('img');
           	if(typeof(src)!='undefined' && src!=''){
               input.val(src);
               img.attr('src',getImgUrl(src));
          	}
           	imgsettimer = setInterval(function(){
               	if(input.val()!=src && input.val()!=''){
                	var url = getImgUrl(input.val());
                   	obj.attr('src',input.val()).find('img').attr('src',url);
               	}
           	},10);
     	} else if(type=='nickname' || type=='vip_price' || type=='title' || type=='marketprice' || type=='productprice' ||
				type=='sub_title' || type=='text' || type=='shopTitle' || type=='shopAddress' || type=='activityaddress' || type=='shopPhone' ||
				type=='name' || type=='position' || type=='address' || type=='mobile' || type=='desc' || type=='wechat' || type=='company_branch' || type=='numbers'){
          	nameset.show();
          	if(type=='text'){
          		textwords.show();
          	}
          	console.log(obj);
          	var color = obj.attr('color') || "#000";
          	var size = obj.attr('size') || "16";
          	var words = obj.attr('words') || "文字";
          	var align = obj.attr('align') || 'left';
          	var line = obj.attr('line') || '1';
          	var input = nameset.find('input:first');
          	var namesize = nameset.find('#namesize');
          	var inputwords = nameset.find('#textwords');
          	var picker = nameset.find('.sp-preview-inner');
          	var textline = nameset.find('#textline');
			//   	console.log(line);

			input.val(color);
         	namesize.val(size.replace("px",""));
          	inputwords.val(words);
			textline.val(line);
          	$(":radio[name='align'][value='" + align + "']").prop("checked", "checked");
          	picker.css( {'background-color':color,'font-size':size});

          	nametimer = setInterval(function(){
          		obj.attr('line',textline.val());
               	obj.attr('color',input.val()).find('.text').css('color',input.val());
               	obj.attr('size',namesize.val() +"px").find('.text').css('font-size',namesize.val() +"px");
               	obj.attr('words',inputwords.val()).find('.text').html(inputwords.val());
               	obj.removeClass('left center').addClass($("input[name='align']:checked").val()).attr('align', $("input[name='align']:checked").val());
           	},10);
     	} else if(type=='qr'){
        	qrset.show();
         	var size = obj.attr('size') || "3";
         	var sel = qrset.find('#qrsize');
         	sel.val(size);
         	sel.unbind('change').change(function(){
              	obj.attr('size',sel.val())
         	});
     	} else if(type=='head' || type=='logo'){
        	headset.show();
         	var border = obj.attr('border');
         	$(":radio[name='style'][value='" + border + "']").prop("checked", "checked");
         	$('#headset input[type="radio"]').change(function () {
         		obj.removeClass('circle radius').addClass($(this).val());
              	obj.attr('border',$(this).val());
         	});
     	}
    }

    $(document).keydown(function(event){
    	if (event.keyCode > 36 && event.keyCode < 41) {
	  		var x = _currentDom.position().left;//水平方向位移
	        var y = _currentDom.position().top;//垂直方向位移
	        var w = _currentDom.width();
	        var h = _currentDom.height();
	        if(event.keyCode == 37){
	        	x = x > 0 ? x - 1 : 0 ;
                _currentDom.css("left", x + "px");
           	}else if(event.keyCode == 38){
           		y = y > 0 ? y - 1 : 0 ;
                _currentDom.css("top",y + "px");
            }else if(event.keyCode == 39){
            	x = (w + x) < 320 ? x + 1 : 320 - w ;
                _currentDom.css("left",x + "px");
            }else if(event.keyCode == 40){
            	y = (h + y) < 568 ? y + 1 : 568 - h ;
                _currentDom.css("top",y + "px");
            }
			event.stopPropagation();
			event.preventDefault();
    	}
	});

	$(function(){
	    {if !empty($item['id'])}
      	$('.drag').each(function(){
          	bindEvents($(this));
      	})
	    {/if}

	    $(':radio[name=type]').click(function(){
	        var type = $(this).val();
	        bindType(type);
	    })

	    $(':radio[name=resptype]').click(function(){
	        var type = $(this).val();
	        if (type == 1) {
	            $(".resptype1").show();
	            $(".resptype0").hide();
	        } else {
	            $(".resptype0").show();
	            $(".resptype1").hide();
	        }
	    })
	    //改变背景
	    $('#bgset').find('button:first').click(function(){
	        var oldbg = $(':input[name=bg]').val();
	        bgtimer = setInterval(function(){
	            var bg = $(':input[name=bg]').val();
	            if(oldbg!=bg){
	             	bg = getImgUrl(bg);
	                $('#poster .bg').remove();
	                var bgh = $("<img src='" + bg + "' class='bg' />");
	                var first = $('#poster .drag:first');
                    if(first.length>0){
                       bgh.insertBefore(first);
                    } else {
                       $('#poster').append(bgh);
                    }
	                oldbg = bg;
	            }
	        },10);
	    })

	    $('.btn-com').click(function(){
	       	var imgset = $('#imgset'), nameset = $("#nameset"),qrset = $('#qrset');
	       	imgset.hide(),nameset.hide(),qrset.hide();
	       	clearTimers();

	        if($('#poster img').length<=0){
	            tip.alert('请先上传海报背景图片!');
	            return;
	        }
	        var type = $(this).data('type');
	        var img = "";
	        var textwords = "";

	        if(type=='qr'){
	            img = '<img src="../addons/{MODULE_NAME}/plugin/diyposter/sys/resource/images/qr.png" />';
	        }else if(type=='head' || type=='logo'){
	            img = '<img src="../addons/{MODULE_NAME}/plugin/diyposter/sys/resource/images/head.jpg" />';
	        }else if(type=='img' || type=='thumb' || type=='shopThumb'){
	            img = '<img src="../addons/{MODULE_NAME}/plugin/diyposter/sys/resource/images/img.jpg" />';
	        }else if(type=='vip_price' || type=='nickname' || type=='title' || type=='marketprice' || type=='productprice' || type=='sub_title' ||
					type=='text' || type=='shopTitle' || type=='shopAddress' || type=='activityaddress' || type=='shopPhone' ||
					type=='name' || type=='position' || type=='address' || type=='mobile' || type=='desc' || type=='wechat' || type=='company_branch' || type=='numbers'){
	        	var textname = $(this).html();
	        	textwords = 'words="'+ textname +'"';
	            img = '<div class=text>'+ textname +'</div>';
	        }
	        var index = $('#poster .drag').length+1;
	        var obj = $('<div class="drag" '+ textwords +' type="' + type +'" index="' + index +'" style="z-index:' + index+'">' + img+'<div class="rRightDown"> </div><div class="rLeftDown"> </div><div class="rRightUp"> </div><div class="rLeftUp"> </div><div class="rRight"> </div><div class="rLeft"> </div><div class="rUp"> </div><div class="rDown"></div></div>');

	        $('#poster').append(obj);

	        bindEvents(obj);

	    });

	 	$('.drag').click(function(){
	        bind($(this));
	    })

	})
</script>
{php include wl_template('common/footer');}